/***************************** 1. let 是ES6的标准  ***********************************************/
// var a = 1;
// let b = 1;

/******* 1.1 越狱  ******/
// {
//     var a = 2;
//     let b = 2;
// }
// // a会被打印
// console.log(a)
// // b不会打印，会报错，这种是常规的，一个变量不应该离开他的作用域
// console.log(b)

/******* 1.2 重复声明  ******/
// // a 允许重复声明
// var a = 1;
// var a = 2;
// var a = 'sss';
// // b 不允许重复声明
// let b = 1;
// let b = 2;



/******* 1.3 变量提升  ******/
// console.log(a)
// var a = 1;
// console.log(b)
// let b = 1;
/***************************** 1. let结论，以后声明变量用let，不再用var了  ******************************/

/***************************** 2. const修饰常量，这个没什么好说的  ******************************/



/***************************** 3. 解构  ******************************/
/******* 3.1 数组解构  ******/
// let arr = [1, 2, 3];
// // console.log(arr[0]);
// let [x,y,z] = arr;
// console.log(x)
// console.log(y)
// console.log(z)
/******* 3.2 对象解构  ******/
// let person = {
//     name: "张三",
//     age:20,
//     email:"haha@guigu.com"
// }
// let {name, age} = person;
// console.log(name)
// console.log(age)
//
// function haha({name, age}) {
//     console.log(name)
//     console.log(age)
// }
// haha(person)

/***************************** 3. 链判断  ******************************/
// let message = null
// console.log(message.body.user.firstName)
// 短路 与
// let content = (message && message.body && message.body.user && message.body.user.firstName) || 'default'
// console.log(content)

// let message = {
//     body: {
//         user: {
//             firstName: '张三'
//         }
//     }
// }
// // 简化
// console.log(message?.body?.user?.firstName)

/***************************** 4. 参数默认值  ******************************/
// function add(a,b) {
//     b = b || 10;
//     return a + b;
// }
// console.log(add(5));

// 有默认值的参数，一定要放在最后面
// function add(a, b = 5) {
//     return a + b;
// }
// console.log(add(5));

/***************************** 6. 箭头函数  ******************************/
// function print(arg) {
//     console.log(arg);
// }
// print(5);
// let print1 = function (arg) {
//     console.log(arg);
// }
//
// print1(5);
//
// let print2 = (arg) => console.log(arg);
// print2(5);
//
// let sum = (a, b) => a + b;
// let sum2 = (a, b) => {
//     let x = a + b;
//     console.log(x)
//     return x;
// }
// print1(sum(1, 2))
// print1(sum2(1, 2))


/***************************** 7. 模板字符串  ******************************/

// let person = {
//     name: "张三",
//     age:20,
//     email:"haha@guigu.com"
// }
//
// let info = `你好，我是${person.name}，今年${person.age}岁，我的邮箱是${person.email}`
// console.log(info)



/***************************** 8. Promise API  ******************************/
// Promise 代表一步对象，类似于Java中的 CompletableFuture
let url = "https://mdn.github.io/learning-area/javascript/apis/fetching-data/can-store/products.json";
//
// let promise = fetch(url)
// // 非阻塞式请求
// console.log(2);
// // 访问成功之后
// promise.then(response => {
//     // console.log(response);
//     console.log(response.json().then(data => {
//         console.log(data);
//     }));
// })
// // 访问失败之后
// promise.catch(err => {
//     console.log("远程抓取失败", err);
// })


/************* 1. 自己封装Promise对象  ***************/
// console.log(1);
// new Promise((resolve, reject) => {
//     resolve(data) // 成功以后
//     reject(err) // 失败以后
// });


/***************************** 8. Async函数  ******************************/

// function func1() {
//     return new Promise((resolve, reject) => {
//         let x = 101;
//         if ( x % 2 === 0) {
//             resolve(x);
//         } else {
//             reject("x不是偶数");
//         }
//     });
// }
//
// func1().then(data => console.log(data)).catch(err => console.log(err));


// async 函数如何隐式返回 Promise，普通函数会变成一个异步函数
// async function func1() {
//     let x = 100;
//     if (x % 2 === 0) {
//         return x;
//     } else {
//         // return "x不是偶数"; 抛出异常，才会被下面的catch捕获
//         throw new Error("x不是偶数");
//     }
// }
//
// func1().then(data => console.log("then", data)).catch(err => console.log("err", err));


// 链式调用太多
// function fetchProducts() {
//     let promise1 = fetch(url);
//     promise1.then(data => {
//             let promise2 = data.json();
//             promise2.then(jdata => {
//                 console.log('jdata', jdata);
//             })
//         }
//     )
// }
//
// fetchProducts();

// 简化fetchProducts调用
// async function fetchProducts2() {
//     let promise1 = await fetch(url);
//     let promise2 = promise1.json();
//     console.log('promise2', promise2)
// }
// fetchProducts2();



/***************************** 10. 模块化  ******************************/
